<template>
  <el-dialog
    :title="dialogObj.title"
    append-to-body
    :visible.sync="dialogObj.show"
    :close-on-click-modal="false"
    :width="btnName === '编辑' ? '1200px' : '600px'"
  >
    <div v-if="btnName === '编辑'">
      <el-form
        ref="form"
        :model="form"
        label-width="120px"
        :rules="rules"
        :disabled="dialogObj.read"
        v-if="dialogObj.show"
        status-icon
      >
        <el-row>
          <el-col :span="12">
            <el-form-item label="编号：" prop="id">
              <el-input
                v-model="form.applyNumber"
                style="width:200px;"
                size="mini"
                :disabled="form.applyNumber !== ''"
                maxlength="20"
                placeholder="编号"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="案卷号：" prop="orderNumber">
              <el-input
                v-model="form.orderNumber"
                style="width:200px;"
                size="mini"
                maxlength="20"
                placeholder="案卷号"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="合同号：" prop="contractNumber">
              <el-input
                v-model="form.contractNumber"
                style="width:200px;"
                size="mini"
                maxlength="20"
                placeholder="合同号"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="客户名称：" prop="customerName">
              <el-input
                v-model="form.customerName"
                style="width:200px;"
                size="mini"
                maxlength="50"
                placeholder="客户名称"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <!-- <el-col :span="12">
            <el-form-item label="类型：" prop="applyType">
              <el-select
                v-model="form.applyType"
                placeholder="请选择"
                style="width:200px;"
                size="mini"
              >
                <el-option
                  v-for="(data, index) in applytype"
                  :key="index"
                  :label="data.value"
                  :value="data.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="12">
            <el-form-item label="项目名称：" prop="title">
              <el-input
                v-model="form.title"
                style="width:200px;"
                size="mini"
                maxlength="50"
                placeholder="项目名称"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="分配时间：" prop="registerDate">
              <el-date-picker
                v-model="form.registerDate"
                style="width:200px;"
                size="mini"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="状态：" prop="status">
              <el-select
                v-model="form.status"
                placeholder="请选择"
                style="width:200px;"
                size="mini"
              >
                <el-option
                  v-for="(data, index) in applyStatusList"
                  :key="index"
                  :label="data.value"
                  :value="data.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="发明人：" prop="inventor">
              <el-input
                v-model="form.inventor"
                style="width:200px;"
                size="mini"
                maxlength="50"
                placeholder="发明人"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="身份证号：" prop="inventorID">
              <el-input
                v-model="form.inventorID"
                style="width:200px;"
                size="mini"
                maxlength="50"
                placeholder="发明人身份证号"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-form-item label="其他发明人：" prop="inventorList">
          <el-input
            v-model="form.inventorList"
            style="width:200px;"
            size="mini"
            maxlength="50"
            placeholder="其他发明人"
          ></el-input>
        </el-form-item>
        <el-form-item label="文件上传：" prop="drawing">
          <upload-picture
            :imageValue="form.drawing"
            @handleSuccess="handleSuccess"
          >
          </upload-picture>
          <span style="color:red;font-size:12px">
            提示：只能上传JPG、JPEG、PNG 格式，且不超过5Mb
          </span>
        </el-form-item>
        <el-form-item label="文稿记录：" prop="draft">
          <files-list
            :tableData="tableData1"
            :fileType="1"
            :isDisable="dialogObj.userName === '代理人'"
            :applyId="dialogObj.id"
            @handleTableDate="handleTableDate"
          >
          </files-list>
        </el-form-item>
        <el-form-item
          label="补正通知书："
          prop="correctNote"
          v-if="dialogObj.id != ''"
        >
          <files-list
            :tableData="tableData6"
            :fileType="6"
            :isDisable="dialogObj.userName === '代理人'"
            :applyId="dialogObj.id"
            @handleTableDate="handleTableDate"
          >
          </files-list>
        </el-form-item>
        <el-row>
          <el-col :span="12">
            <el-form-item label="下发补正时间：" prop="issueCorrectTime">
              <el-date-picker
                v-model="form.issueCorrectTime"
                style="width:200px;"
                size="mini"
                format="yyyy-MM-dd"
                :disabled="dialogObj.userName === '代理人'"
                value-format="yyyy-MM-dd"
                @change="issueCorrectTimeChanged"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="补正截止时间：" prop="endCorrectTime">
              <el-date-picker
                v-model="form.endCorrectTime"
                style="width:200px;"
                size="mini"
                :disabled="dialogObj.userName === '代理人'"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
          <el-form-item
        label="答复补正文件："
        prop="correctNote"
        v-if="dialogObj.id != ''"
      >
        <files-list
          :tableData="tableData61"
          :fileType="61"
          :applyId="dialogObj.id"
          @handleTableDate="handleTableDate"
        >
        </files-list>
      </el-form-item>
         <el-row v-if="dialogObj.id != ''">
        <el-col :span="12">
          <el-form-item label="答复补正时间：" prop="answerCorrectTime">
            <el-date-picker
              v-model="form.answerCorrectTime"
              style="width:200px;"
              size="mini"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="答复补正结果文件：" prop="answerCorrectFile">
            <upload-file
              :imageValue="form.answerCorrectFile"
              :isNotlist="true"
              @handlefileSuccess="answerCorrectFileSuccess"
            >
            </upload-file>
          </el-form-item>
        </el-col>
      </el-row>
        <el-form-item
          label="审查意见："
          prop="examinationOpinion"
          v-if="dialogObj.id != ''"
        >
          <files-list
            :tableData="tableData7"
            :fileType="7"
            :isDisable="dialogObj.userName === '代理人'"
            :applyId="dialogObj.id"
            @handleTableDate="handleTableDate"
          >
          </files-list>
        </el-form-item>
        <el-row v-if="dialogObj.id != ''">
          <el-col :span="12">
            <el-form-item
              label="下发审查意见时间："
              prop="issueExaminationTime"
            >
              <el-date-picker
                v-model="form.issueExaminationTime"
                style="width:200px;"
                size="mini"
                :disabled="dialogObj.userName === '代理人'"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                @change="issueExaminationTimeChanged"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="审查意见截止时间：" prop="endExaminationTime">
              <el-date-picker
                v-model="form.endExaminationTime"
                style="width:200px;"
                size="mini"
                :disabled="dialogObj.userName === '代理人'"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item
        label="答复审查意见文件："
        prop="correctNote"
        v-if="dialogObj.id != ''"
      >
        <files-list
          :tableData="tableData71"
          :fileType="71"
          :applyId="dialogObj.id"
          @handleTableDate="handleTableDate"
        >
        </files-list>
      </el-form-item>
      <el-row v-if="dialogObj.id != ''">
        <el-col :span="12">
          <el-form-item
            label="答复审查意见时间："
            prop="answerExaminationTime"
          >
            <el-date-picker
              v-model="form.answerExaminationTime"
              style="width:200px;"
              size="mini"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            label="答复审查意见结果文件："
            prop="answerExaminationFile"
          >
            <upload-file
              :imageValue="form.answerExaminationFile"
              :isNotlist="true"
              @handlefileSuccess="answerExaminationFileSuccess"
            >
            </upload-file>
          </el-form-item>
        </el-col>
      </el-row>
        <el-form-item label="备注：" prop="description">
          <el-input
            v-model="form.description"
            style="width:400px;"
            size="mini"
            type="textarea"
            maxlength="100"
            placeholder="备注"
          ></el-input>
        </el-form-item>
      </el-form>
    </div>
    <div v-else>
      <el-input
        type="textarea"
        :rows="4"
        placeholder="请输入驳回理由"
        v-model="reason"
      >
      </el-input>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="sub" size="mini">确 定</el-button>
      <el-button @click="dialogObj.show = false" size="mini">取 消</el-button>
    </span>
  </el-dialog>
</template>
<script>
import { _debounce } from "@u/debounce";
import uploadPicture from "@c/uploadPicture";
import filesList from "./filesList";
import uploadFile from "@c/uploadFile";
import { APPLYFILELIST, APPLYCATEGORYLIST, APPLYSTATUSLIST } from "@u/wordbook";
import {
  updateApplyManageApi,
  getApplyManageApi,
  submitApplyFileListApi,
  workPlanReasonApi,
} from "@s/api";
import { validateTemplate, validatetitleNumber } from "@u/validate";
export default {
  orderNumber: "dialogCom",
  props: ["dialogObj", "btnName"],
  components: { uploadPicture, filesList,uploadFile },
  data() {
    return {
      form: {
        id: undefined,
        orderNumber: "",
        contractNumber: "",
        title: "",
        applyNumber: "",
        // applyType: "",
        customerName: "",
        registerDate: "",
        status: "",
        drawing: "",
        description: "",
        inventor: "",
        inventorID: "",
        inventorList: "",
        tableData1: [],
        tableData6: [],
        tableData7: [],
        tableData61: [],
        tableData71: [],
        answerCorrectTime: "",
        issueCorrectTime: "",
        endCorrectTime: "",
        answerCorrectFile: "",
        answerExaminationTime: "",
        answerExaminationFile: "",
        issueExaminationTime: "",
        endExaminationTime: "",
      },
      reason: "",
      agentList: [],
      tableData1: [],
      tableData6: [],
      tableData7: [],
      tableData61: [],
      tableData71: [],
      // applytype: [],
      applyStatusList: APPLYSTATUSLIST,
      applyFileList: APPLYFILELIST,
      applyCategoryList: APPLYCATEGORYLIST,
      rules: {
        id: [
          { required: true, trigger: "blur", message: "请输入客户" },
          { validator: validateTemplate },
        ],
        orderNumber: [
          { required: true, trigger: "blur", message: "请输入案件名称" },
          { validator: validateTemplate },
        ],
        contractNumber: [
          { required: true, trigger: "blur", message: "请输入发明人" },
          { validator: validateTemplate },
        ],
        customerName: [
          { required: true, trigger: "blur", message: "请输入身份账号" },
          { validator: validateTemplate },
        ],
        title: [
          { required: true, message: "请选择手机号", trigger: "blur" },
          { validator: validatetitleNumber },
        ],
        registerDate: [
          { required: true, message: "请输入立案日", trigger: "blur" },
          { validator: validateTemplate },
        ],
      },
    };
  },
  mounted() {},
  methods: {
    // 数据回显
    initDialog() {
      if (this.dialogObj.id) {
        let json = { applyId: this.dialogObj.id };
        getApplyManageApi(json).then((res) => {
          this.form.id = this.dialogObj.id;
          this.form.orderNumber = this.dialogObj.form.orderNumber;
          this.form.contractNumber = this.dialogObj.form.contractNumber;
          this.form.applyNumber = this.dialogObj.form.applyNumber;
          // this.form.applyType = res.applyType;
          this.form.customerName = this.dialogObj.form.customerName;
          this.form.title = this.dialogObj.form.title;
          this.form.registerDate = this.dialogObj.form.registerDate;
          this.form.drawing = this.dialogObj.form.drawing;
          this.form.status = res.status;
          this.form.inventor = res.inventor;
          this.form.answerCorrectTime = res.answerCorrectTime;
           this.form.answerCorrectFile = res.answerCorrectFile;
           this.form.answerExaminationTime = res.answerExaminationTime;
           this.form.answerExaminationFile = res.answerExaminationFile;
          this.form.inventorID = res.inventorID;
          this.form.inventorList = res.inventorList;
          // this.applytype = this.applyCategoryList[res.applyCategory - 1].type;
          this.form.description = this.dialogObj.form.description;
          if (res.filesOutputBeanList1) {
            this.form.tableData1 = res.filesOutputBeanList1;
            this.tableData1 = JSON.parse(
              JSON.stringify(res.filesOutputBeanList1)
            );
          } else {
            this.form.tableData1 = [];
            this.tableData1 = [];
          }
          if (res.filesOutputBeanList6) {
            this.form.tableData6 = res.filesOutputBeanList6;
            this.tableData6 = JSON.parse(
              JSON.stringify(res.filesOutputBeanList6)
            );
          } else {
            this.form.tableData6 = [];
            this.tableData6 = [];
          }
             if (res.filesOutputBeanList61) {
            this.form.tableData61 = res.filesOutputBeanList61;
            this.tableData61 = JSON.parse(
              JSON.stringify(res.filesOutputBeanList61)
            );
          } else {
            this.form.tableData61 = [];
            this.tableData61 = [];
          }
              if (res.filesOutputBeanList71) {
            this.form.tableData71 = res.filesOutputBeanList71;
            this.tableData71 = JSON.parse(
              JSON.stringify(res.filesOutputBeanList71)
            );
          } else {
            this.form.tableData71 = [];
            this.tableData71 = [];
          }
          if (res.filesOutputBeanList7) {
            this.form.tableData7 = res.filesOutputBeanList7;
            this.tableData7 = JSON.parse(
              JSON.stringify(res.filesOutputBeanList7)
            );
          } else {
            this.form.tableData7 = [];
            this.tableData7 = [];
          }
        });
      }
    },
    // 更新数据
    sub: _debounce(function() {
      if (this.btnName === "编辑") {
        this.$refs["form"].validate((valid) => {
          if (valid) {
            this.updateSub();
          }
        });
      } else if (this.btnName === "驳回") {
        workPlanReasonApi({ reason: this.reason, caseId: this.dialogObj.id,status: 3 })
        this.dialogObj.show = false;
        this.reason = "";
        this.$emit("reflash");
        this.$message({
          type: "success",
          message: "案件已驳回！",
        });
      }
    }),
    handleTableDate() {},
    // 下发审查意见时间：/截至时间
    issueExaminationTimeChanged(value) {
      let endExaminationTime = this.dayjs(value)
        .add(55, "day")
        .format("YYYY-MM-DD");
      this.form.endExaminationTime = endExaminationTime;
    },
    // 下发补正时间：截至时间
    issueCorrectTimeChanged(value) {
      let endCorrectTime = this.dayjs(value)
        .add(55, "day")
        .format("YYYY-MM-DD");
      this.form.endCorrectTime = endCorrectTime;
    },
    // 更新接口
    updateSub() {
      if (
        !this.checkFileInfo(this.tableData1, 1) ||
        !this.checkFileInfo(this.tableData6, 6) ||
        !this.checkFileInfo(this.tableData7, 7) ||
         !this.checkFileInfo(this.tableData61, 61)||
         !this.checkFileInfo(this.tableData71, 71)
      ) {
        return;
      }
      // // 上传补正通知书后校验下发补正通知书时间和补正截止时间
      // if (this.tableData6.length > 0) {
      //   if (
      //     this.form.issueCorrectTime == "" ||
      //     this.form.issueCorrectTime == null ||
      //     this.form.endCorrectTime == "" ||
      //     this.form.endCorrectTime == null
      //   ) {
      //     this.$message({
      //       type: "warning",
      //       message: "请填写下发补正时间和补正截止时间后再保存！",
      //     });
      //     return;
      //   }
      // }
      // 上传审查意见后校验下发审查意见时间和审查意见截止时间
      // if (this.tableData7.length > 0) {
      //   if (
      //     this.form.issueExaminationTime == "" ||
      //     this.form.issueExaminationTime == null ||
      //     this.form.endExaminationTime == "" ||
      //     this.form.endExaminationTime == null
      //   ) {
      //     this.$message({
      //       type: "warning",
      //       message: "请填写下发审查意见时间和审查意见截止时间后再保存！",
      //     });
      //     return;
      //   }
      // }
      let json = JSON.parse(JSON.stringify(this.form));
      // 调用更新接口
      updateApplyManageApi(json).then(() => {
        this.dialogObj.show = false;
        this.saveFileList(this.form.tableData1, this.tableData1, 1);
        this.saveFileList(this.form.tableData6, this.tableData6, 6);
        this.saveFileList(this.form.tableData7, this.tableData7, 7);
         this.saveFileList(this.form.tableData61, this.tableData61, 61);
         this.saveFileList(this.form.tableData71, this.tableData71, 71);
        this.$emit("reflash");
        this.$message({
          type: "success",
          message: "修改成功！",
        });
      });
    },
    checkFileInfo(arr_new, type) {
      var fileName = this.applyFileList.find((v) => v.id === type).value;
      // 文件校验
      for (var i = 0; i < arr_new.length; i++) {
        if (arr_new[i].fileName == "") {
          this.$message({
            type: "warning",
            message: fileName + " 请输入文件名称后再保存！",
          });
          return false;
        }
        if (arr_new[i].filePath == "") {
          this.$message({
            type: "warning",
            message: fileName + " 请上传文件后再保存！",
          });
          return false;
        }
      }
      return true;
    },
    // 更新上传文件数据
    saveFileList(arr_org, arr_new, type) {
      if (arr_org.length == arr_new.length) {
        let isSave = false;
        // 个数一样
        for (var i = 0; i < arr_org.length; i++) {
          if (
            arr_org[i].createTime != arr_new[i].createTime ||
            arr_org[i].createUser != arr_new[i].createUser ||
            arr_org[i].fileDesc != arr_new[i].fileDesc ||
            arr_org[i].fileName != arr_new[i].fileName ||
            arr_org[i].filePath != arr_new[i].filePath ||
            arr_org[i].fileType != arr_new[i].fileType ||
            arr_org[i].id != arr_new[i].id ||
            arr_org[i].patentApplyId != arr_new[i].patentApplyId ||
            arr_org[i].updateTime != arr_new[i].updateTime ||
            arr_org[i].updateUser != arr_new[i].updateUser
          ) {
            // 有不同文件存在
            isSave = true;
            break;
          }
        }
        if (isSave) {
          // 保存文件
          this.submitFileList(arr_new, type);
        }
      } else {
        // 个数不一样 保存文件
        this.submitFileList(arr_new, type);
      }
    },
    // 更新上传文件数据
    submitFileList(arr_new, type) {
      let json = {
        applyId: this.form.id,
        fileType: type,
        applyFilesList: arr_new,
      };
      submitApplyFileListApi(json).then();
    },
    // 图片上传
    handleSuccess(val) {
      this.form.drawing = val;
    },
    answerCorrectFileSuccess(val) {
      this.form.answerCorrectFile = val;
      this.form.answerCorrectTime = this.dayjs().format("YYYY-MM-DD");
    },
    answerExaminationFileSuccess(val) {
      this.form.answerExaminationFile = val;
      this.form.answerExaminationTime = this.dayjs().format("YYYY-MM-DD");
    },
  },
  watch: {
    "dialogObj.show"(val) {
      if (val) {
        this.initDialog();
      }
    },
  },
};
</script>
<style scoped lang="scss">
.el-select-dropdown__item.hover,
.el-select-dropdown__item:hover {
  color: #409eff !important;
  font-weight: 700 !important;
}
</style>
